.banner-box{
	position: relative;
	.banner-list{
		li{
			position: absolute;
			top: 0;
			left: 0;
			img{
				width: 100%;
				height: 350px;
			}
		}	
	}
	.banner-point{
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 6;
		text-align: right;
		padding-right: 80px;
		span{
			display: inline-block;
			width: 50px;
			height: 6px;
			background: #3cb43c;
			border-radius: 3px;
			cursor: pointer;
			&:hover,&.active{
				background: orange;
			}
		}
	}
	.cat-section{
		position: relative;
		z-index: 5;
		.cat-left{
			float: left;
			width: 292px;
			height: 350px;
			background: rgba(0,0,0,0.6);
			.cat-left-item{
				line-height: 28px;
				padding: 14px 40px;
				border-left: 2px solid transparent;
				border-top: 2px solid transparent;
				border-bottom: 1px solid #fff;
				.item-title {
					font-size: 14px;
					padding-left: 35px;
					position: relative;
					span{
						color: #fff;
					}
					span.icon{
						background: url(../images/nav-icon.png);
						display: block;
						width: 20px;
						height: 20px;
						position: absolute;
						left: 0;
						top: 6px;
						&.around-icon{
							background-position: 0 0;
						}
						&.internal-icon{
							background-position: 0 -30px;
						}
						&.abroad-icon{
							background-position: 0 -57px;
						}
						&.outdoor-icon{
							background-position: 0 -86px;
						}
					}
					span.arrow{
						display: block;
						background: url(../images/nav-icon.png);
					    width: 6px;
					    height: 9px;
					    background-position: 0 -171px;
					    position: absolute;
					    right: 15px;
					    top: 10px;
					}
				}
				.item-con{
					span{
						display: inline-block;
						line-height: 25px;
						color: #B5B5B5;
						font-size: 12px;
						margin-right: 10px;
						&:last-child{
							margin-right: 0;
						}
					}
				}
				&:last-child{
					border-bottom: 0 none;
				}
				&.active,&:hover{
					border: 2px solid #3cb43c;
					border-right: 0 none;
					background: #fff;
					.item-title{
						span{
							color: #333;
						}	
					}
				}
			}
		}
		.cat-right{
			float: left;
			position: relative;
			display: none;
			.cat-right-item{
				width: 400px;
				height: 350px;
				position: absolute;
				background: #fff;
				border: 2px solid #3cb43c;
				border-left: 0 none;
				box-sizing: border-box;
				padding: 20px;
				.item-group {
					margin-bottom: 20px;
					.item-title {
						line-height: 40px;
						font-size: 14px;
						color: #333;
						border-bottom: 1px solid #e0e0e0;
						padding-left: 10px;
					}
					.item-con{
						line-height: 30px;
						a {
							display: inline-block;
							font-size: 12px;
							padding: 0 10px;
							color: #808080;
							&:hover{
								color: #3cb43c;
							}
						}
					}
					.item-img{
						padding: 18px 10px;
						a{
							display: inline-block;
							position: relative;
							padding: 0 4px;
							img{
								display: block;
								width: 100px;
								height: 66px;
							}
							.top{
								position: absolute;
								top: 0;
								left: 4px;
								display: block;
								font-size: 12px;
							    background-color: #f97700;
							    color: #fff;
							    padding: 4px;
							}
						}
					}
					.item-outing{
						a {
							display: inline-block;
							width: 64px;
							height: 64px;
							padding: 10px;
						}
					}
				}
			}
		}
	}
}
.main{
	.item-group{
		padding-top: 60px;
		.item-top{
			padding: 30px 0;
			border-top: 1px solid #808080;
			position: relative;
			.item-title{
				width: 100%;
				height: 50px;
				line-height: 50px;
				position: absolute;
				top: -26px;
				left: 0;
				.item-title-con{
					font-size: 30px;
					width: 340px;
					margin: 0 auto;
					background: #fff;
					text-align: center;
					position: relative;
					i{
						width: 18px;
					    height: 2px;
					    background-color: #333;
					    position: absolute;
					    top: 50%;
					    &.left-hr{
					    	left: -18px;
					    }
					    &.right-hr{
					    	right: -18px;
					    }
					}
				}			
			}
			p{
				color: #808080;
				text-align: center;
				font-size: 12px;
			}
		}
		.item-list{
			li{
				width: 291px;
			    height: 195px;
			    margin: 0 1px 1px 0;
			    position: relative;
			    z-index: 0;
			    overflow: hidden;
			    float: left;
			    a{
			    	display: block;
			    	span{
			    		position: absolute;
			    		display: block;
			    		&.item-icon{
							width: 72px;
							height: 72px;
							left: 50%;
						    top: 63px;
						    margin: 0 0 0 -36px;
						    z-index: 2;
			    		}
			    		&.item-txt{
						    top: 145px;
						    width: 100%;
						    height: 21px;
						    line-height: 21px;
						    color: #fff;
						    font-size: 16px;
						    text-align: center;
						    z-index: 3;
			    		}
			    	}
			    	.item-bg{
			    		transition: all 0.5s linear;
			    		&:hover{
			    			transform: scale(1.3,1.3);
			    		}
			    	}
			    }
			}
		}
		.item-week{
			li.item{
				float: left;
				width: 368px;
			    height: 110px;
			    margin: 0 20px 20px 0;
			    position: relative;
			    background-color: #fafafa;
			    border: 1px solid #fff;
			    &:hover{
			    	border: 1px solid #3cb43c;
			    }
			    .pic{
			    	float: left;
			    	position: relative;
			    	img{
			    		width: 120px;
			    		height: 110px;
			    	}
			    	.pic-type{
			    		position: absolute;
			    		top: 0;
			    		left: 5px;
			    		width: 38px;
			    		height: 26px;
			    		background: url(../images/index-icon.png) 0 0 no-repeat;
			    		font-size: 12px;
			    		color: #fff;
			    		text-align: center;
			    	}
			    }
			    .info{
			    	float: right;
			    	width: 224px;
			    	padding: 8px 10px 8px 0;
			    	line-height: 20px;
			    	.info-title{
			    		font-size: 14px;
			    		color: #333;
			    		height: 40px;
			    		display: -webkit-box;
			    		-webkit-box-orient: vertical;
			    		-webkit-line-clamp: 2;
			    		overflow: hidden;
			    	}
			    	.info-base{
			    		padding: 8px 0;
			    		i.icon{
			    			background: url(../images/index-icon.png) no-repeat;
			    			display: inline-block;
			    			width: 20px;
			    			height: 20px;
			    			vertical-align: middle;
			    			margin-right: 5px;
			    		}
						span{
							display: inline-block;
							font-size: 12px;
							margin-right: 10px;
							.icon-cal{
								background-position: 0 -37px;
							}
							.icon-site{
								background-position: -26px -37px;
							}
						}
			    	}
			    	.strbox{
			    		position: relative;
			    		span.str {
			    			font-size: 12px;
			    		}
			    		span.price{
			    			position: absolute;
			    			top: 0;
			    			right: 0;
			    			font-size: 14px;
			    			color: #f97700;
			    			&:before{
			    				content: '￥';
			    			}
			    			em{
			    				color: #f97700;
			    				font-size: 18px;
			    			}
			    		}
			    		i{
		    				display: inline-block;
						    width: 10px;
						    height: 3px;
						    background-color: #e0e0e0;
						    margin-right: 2px;
						    vertical-align: top;
						    margin-top: 10px;
						    &.active{
						    	background: #f19149;
						    }
		    			}
			    	}
			    }
			}
			li.week-more {
				float: left;
				width: 368px;
			    height: 110px;
			    margin: 0 20px 20px 0;
			    position: relative;
			    background:url(../images/week/week-more.jpg);
			    border: 1px solid #fff;
			    .more {
		    	    display: block;
				    height: 48px;
				    line-height: 48px;
				    font-size: 18px;
				    color: #fff;
				    text-align: center;
				    padding: 31px 0;
				     .icon-more {
				    	display: inline-block;
				    	width: 48px;
					    height: 48px;
					    background: url(../images/index-icon.png) no-repeat;
					    vertical-align: middle;
					    margin-left: 32px;
					    background-position: 0 -69px;
				    }
			    }
			}
		}
		.item-box {
			.item{
				position: relative;
				width: 272px;
				height: 458px;
			    margin-right: 18px;
			    float: left;
			    border: 1px solid #e0e0e0;
			    overflow: hidden;
				.item-content{
					position: relative;
					.item-img{
						width: 272px;
						height: 458px;
					}
				    &:nth-child(4n){
				    	margin-right: 0;
				    }
			    	.type{
			    		position: absolute;
			    		top: 20px;
			    		left: 20px;
			    		color: #fff;
			    		display: inline-block;
			    		width: 50px;
			    		height: 24px;
			    		line-height: 24px;
			    		text-align: center;
			    		font-size: 14px;
			    		&.sy{
			    			background: #8ac83f; 
			    		}
			    		&.sy{
			    			background: #fe5c59;
			    		}
			    		&.zj{
			    			background: #f97700;
			    		}
			    		&.ds{
			    			background: #fe5c59;
			    		}
			    	}
			    	.intro{
			    		position: absolute;
			    		left: 0;
			    		right: 0;
			    		bottom: 40px;
			    		padding: 0 16px;
			    		color: #fff;
			    		.title{
			    			line-height: 30px;
						    height: 60px;
						    font-size: 24px;
						    margin-top: 15px;
						    color: #fff;
			    		}
			    		.look{
		    			    font-size: 12px;
						    font-family: "SimSun";
						    height: 20px;
						    line-height: 20px;
						    margin-top: 15px;
						    color: #fff;
						    span{
						    	color: #fff;
						    }
			    		}
			    	}
			    }
			    .pop{
					position: absolute;
					top: 0;
					bottom: 0;
					left: 0;
					right: 0;
					background: #fff;
					z-index: 2;
					display: none;
					.pop-box{
						display: block;
					}
					.pop-title{
						margin: 18px 18px 10px;
					    font-size: 18px;
					    height: 30px;
					    line-height: 30px;
					    text-align: center;
					    overflow: hidden;
					}
					.look{
						margin: 10px 18px;
					    font-size: 12px;
					    color: #808080;
					    font-family: "SimSun";
					    height: 20px;
					    line-height: 20px;
					    text-align: center;
					}
					.pop-con{
						line-height: 24px;
					    margin: 15px 18px;
					    height: 288px;
					    overflow: hidden;
					    text-align: Justify;
					    color: #333;
					    font-size: 14px;
					    text-indent: 28px;
					}
					.pop-footer{
						padding: 0 16px 16px;
						.pop-footer-box{
							border-top: 1px solid #e0e0e0;
							padding-top: 16px;
							position: relative;
							a.icon{
								background: url(../images/index-icon.png) no-repeat;
								display: inline-block;
								width: 28px;
								height: 28px;
								margin-right: 8px;
								&.first{
									background-position: 0 0;
								}
								&.qq{
									background-position: 0 -125px;
								}
								&.weixin{
									background-position: -35px -125px;
								}
								&.xinlang{
									background-position: -70px -125px;
								}
							}
							a.more-txt{
								display: inline-block;
								line-height: 28px;
								padding: 0 10px;
								font-size: 12px;
								color: #333;
								position: absolute;
								top: 16px;
								right: 0;
								background: #f9f9f9;
							}
						}
					}
		    	}
			}    
		}
	}
	.us{
		padding: 50px 0;
		ul{
			background: #f9f9f9;
			padding: 30px 60px;
			li{
				float: left;
				margin-right: 70px;
				&.width0{
					width: 230px;
				}
				&.width1{
					width: 280px;
				}
				&.width2{
					width: 400px;
					margin-right: 0;
				}
				.us-title{
					height: 33px;
				    line-height: 33px;
				    font-size: 18px;
				    border-bottom: 1px solid #e5e5e5;
				    padding-bottom: 5px;
				    i{
				    	background: url(../images/index-icon.png) no-repeat;
				    	display: inline-block;
				    	width: 33px;
					    height: 33px;
					    vertical-align: top;
					    margin-right: 10px;
					    &.icon-product{
					    	background-position: 0 -159px;
					    }
					    &.icon-service{
					    	background-position: 0 -196px;
					    }
					    &.icon-area{
					    	background-position: 0 -229px;
					    }
				    }
				}
				.us-product{
					a{
						display: inline-block;
						width: 70px;
						height: 36px;
						line-height: 36px;
						color: #333;
						font-size: 14px;
						margin-right: 3px;
					}
				}
				.us-service{
					p{
						line-height: 36px;
						font-size: 14px;
						color: #333;
					}
				}
				.us-area{
					span{
						display: inline-block;
						width: 195px;
						height: 36px;
						line-height: 36px;
						font-size: 14px;
						color: #333;
						margin-right: 2px;
					}
				}
			}
		}
	}
}